<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
	<link href="./css/bootstrap.css" rel="stylesheet" type="text/css" />
</h:head>

<f:event listener="#{addDepositOrSavingAccount.onLoad}" type="preRenderView"></f:event>

<body>
	<ui:include src="./header.xhtml" />
	<div id="content-outer">
		<div id="content">

			<!--  start page-heading -->
			<div id="page-heading">
				<h1>Account Management</h1>
			</div>
			<!-- end page-heading -->
			<h:form id="mainform" action="">
				<h1 style="padding: 20px; text-align: center">Add New Account
					Information</h1>
				<!-- 				<div id="content-table-inner"> -->


				<div class="row-fuilt">
					<div class="offset4">
				<div class="controls-row ">
							<div class="control-group">
								<label
									style="width: 150px; float: left; color: black; text-align: left">
									Account Type:</label>
								<h:selectOneMenu value="#{addDepositOrSavingAccount.accountType}" onchange="submit()"
								valueChangeListener="#{addDepositOrSavingAccount.showCurrency}">
									<f:selectItem itemValue="deposit" itemLabel="Deposit Account"></f:selectItem>
									<f:selectItem itemValue="saving" itemLabel="Saving Account"></f:selectItem>
									
								</h:selectOneMenu>
							</div>
						</div>
						
						<ui:fragment rendered="#{addDepositOrSavingAccount.showCurrency == 'show'}">
						<div class="controls-row ">
							<div class="control-group">
								<label
									style="width: 150px; float: left; color: black; text-align: left">
									Currency Type:</label>
							<h:selectOneMenu value="#{addDepositOrSavingAccount.currency}">
							 <f:selectItem  itemValue="usd" itemLabel="USD"></f:selectItem>
							 <f:selectItem  itemValue="vnd" itemLabel="VND"></f:selectItem>
						</h:selectOneMenu>
									
							</div>
						</div>
						</ui:fragment>
							<ui:fragment rendered="#{addDepositOrSavingAccount.showCurrency == 'hide'}">
							</ui:fragment>
						<div class="controls-row ">
							<div class="control-group">
								<label
									style="width: 150px; float: left; color: black; text-align: left">
									Account Balance:</label>
								<h:inputText value="#{addDepositOrSavingAccount.accountBalance}"
									style="float: left; width: 365px">
									<f:ajax event="keyup" render="BalanceStatus" />
								</h:inputText>
								<h:outputText id="BalanceStatus" escape="false"
									value="#{addDepositOrSavingAccount.balanceStatus}" />
							</div>
						</div>
					
<!-- 						<div class="controls-row "> -->
<!-- 							<div class="control-group"> -->
<!-- 								<label -->
<!-- 									style="width: 150px; float: left; color: black; text-align: left"> -->
<!-- 									Internet Account:</label> -->
<!-- 								<h:inputText value="#{addDepositOrSavingAccount.username}" -->
<!-- 									style="float: left; width: 300px" /> -->
<!-- 							</div> -->
<!-- 						</div> -->
<!-- 						<div class="controls-row "> -->
<!-- 							<div class="control-group"> -->
<!-- 								<label -->
<!-- 									style="width: 150px; float: left; color: black; text-align: left"> -->
<!-- 									Password :</label> -->
<!-- 								<h:inputSecret value="#{addDepositOrSavingAccount.password}" -->
<!-- 									style="float: left; width: 300px" /> -->
<!-- 							</div> -->
<!-- 						</div> -->
						<div class="row-fuilt" style="margin-left: 180px">
							<h:commandButton value="Submit" type="submit"
								action="#{addDepositOrSavingAccount.submit}" style="width: 100px"
								class="btn btn-primary"></h:commandButton>
							<h:commandButton value="Cancel" type="button"
								action="#{addDepositOrSavingAccount.cancel}"
								style="width: 100px; margin-left: 30px" class="btn"
								onclick="history.back();"></h:commandButton>

						</div>
					</div>
				</div>
			</h:form>
		</div>
	</div>
</body>
</html>
